<template>
  <div>
    <Heater />
    <div class="money-e"></div>
    <div class="money-f">
      <p>登录后查看你的投资资产</p>
      <button>点击登录</button>
    </div>
    <div class="money-b">
      <Main v-for="(v, i) in arr" :key="i" :texta="v.a" :textb="v.b" />
    </div>
    <Stork />
    <div class="my">
      <div class="money-a">
        <h4>银行存款</h4>
        <span>更多</span>
      </div>
      <ul>
        <Deposit v-for="(v, i) in list" :key="i" :texta="v.data" :textb="v.datab" />
      </ul>
    </div>
    <div class="live">
      <div class="live-a">
        <h4>幸福保障</h4>
        <span>更多</span>
      </div>
      <div class="live-b">
        <Live v-for="(v,i) in datalist" :key="i" :txt="v.ta" :txta="v.tb" :txtb="v.tc" :txtc="v.td"/>
      </div>
      
    </div>
    <div class="cai">
      <h4>财富号</h4>
      <img src="images/2_15.jpg" alt="">
    </div>
    <div class="ke">
      <h4>财富讲堂</h4>
      <img src="images/2_18.jpg" alt="">
    </div>
    <div class="Tips">
      <div class="tips-a">
        <h4>财富锦囊</h4>
        <span>更多</span>
      </div>
      <img src="images/2_20.jpg" alt="">
      <Score v-for="(v,i) in scoreList" :key="i" :scea="v.e" :sceb="v.f" :sced="v.g"/>
    </div>
     <Btn/>
  </div>
</template>

<script>
import Heater from "@/components/home-page/header.vue";
import Main from "@/components/home-page/main.vue";
import Stork from "@/components/wealth/stock.vue";
import Deposit from "@/components/wealth/deposit.vue";
import Live from "@/components/wealth/live.vue";
import Score from "@/components/wealth/score.vue";
import Btn from '@/components/bottomBar.vue'
export default {
  data() {
    return {
      arr: [
        { a: "iconfont icon-duozhongzhifu", b: "申请办卡" },
        { a: "iconfont icon-hebaoguanli", b: "申请进度" },
        { a: "iconfont icon-daikuan", b: "卡片启用" },
        { a: "iconfont icon-shenghuojiaofei", b: "云闪付" },
        { a: "iconfont icon-e", b: "自动还款" },
        { a: "iconfont icon-anquanzhongxin", b: "账户安全锁" },
        { a: "iconfont icon-guijinshu", b: "环球旅行卡" },
        { a: "iconfont icon-jiaotongchuhang_gaodedache", b: "智行天下" },
        { a: "iconfont icon-renwuzhongxin", b: "一键绑卡" },
        { a: "iconfont icon-zixinzhengmingzhaopian", b: "信用报告" },
      ],
      list: [
        { data: "1.55%", datab: "50元起购 6个月" },
        { data: "1.75%", datab: "50元起购 1年" },
        { data: "2.55%", datab: "50元起购 2年" },
      ],
      datalist:[
        {ta:"images/2_07.jpg",tb:"工银安盛人寿御立方六号保不会",tc:"多重保障御健康,满期给付享未来",td:"23215"},
        {ta:"images/2_10.jpg",tb:"泰康幸福世嘉保险产品计划",tc:"退休养老资产传承财富增值",td:"8277"},
        {ta:"images/2_12.jpg",tb:"工银安盛人寿鑫丰益保险产二",tc:"鑫满益足,丰格年年",td:"919"}
      ],
      scoreList:[
        {e:"机构：A股有望迎“暖冬”",f:"2021-10-15",g:"images/2_07.jpg"},
        {e:"产品涨价  锌生产商利润大增”",f:"2021-10-15",g:"images/2_07.jpg"},
        {e:"578家公司前三季度业绩预喜有色、钢铁及半导体等行业更好",f:"2021-10-15",g:"images/2_07.jpg"}
      ]
    };
  },
  components: {
    Heater,
    Main,
    Stork,
    Deposit,
    Live,
    Score,
    Btn
  },
};
</script>

<style scoped>
h4{
  font-size: 0.16rem;
}
span{
  font-size: 0.12rem;
}
.money-e {
  height: 0.3rem;
}
.money-f {
  width: 2.83rem;
  height: 1.01rem;
  /* border: 1px solid red; */
  background-color: antiquewhite;
  border-radius: 0.05rem;
  margin: auto;
  text-align: center;
}
.money-f p {
  font-size: 0.08rem;
  padding: 0.27rem 0 0.08rem;
}
.money-f button {
  width: 1.34rem;
  height: 0.35rem;
  font-size: 0.16rem;
  color: #f69c94;
  display: block;
  border: 0.01rem solid #f69c94;
  border-radius: 0.2rem;
  margin: auto;
  background-color: white;
}
.money-b {
  width: 100%;
  height: 1.4rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.money-a {
  width: 2.9rem;
  height: 0.78rem;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
/* .money-a span{
  font-size: 0.12rem;
} */
.my ul {
  width: 2.84rem;
  height: 1.43rem;
  margin: auto;
  display: flex;
}
.live-a{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 2.9rem;
  height: 0.58rem;
  margin: auto;
}
.cai{
  width: 2.9rem;
  margin: auto;
}
.cai h4{
  height: 0.57rem;
  line-height: 0.57rem;
}
.cai img{
  width: 2.9rem;
  height: 0.82rem;
}
.ke{
  width: 2.9rem;
  margin: auto;
}
.ke h4{
  height: 0.69rem;
  line-height: 0.69rem;
}
.ke img{
  width: 2.9rem;
  height: 0.93rem;
}
.Tips{
  width: 2.9rem;
  margin: auto;
  padding-bottom: 0.5rem;
}
.tips-a{
  width: 2.9rem;
  height: 0.63rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: auto;
}
.Tips img{
  width: 2.9rem;
  height: 0.63rem;
}
</style>